<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0,user-scalable=no">
	<meta name="apple-mobile-web-app-capable" content="yes">
	<title>每日签到</title>
	<link rel="stylesheet" type="text/css" href="css/style.css">
</head>
<body>
	<div class="qiandao">
		<div class="top">
			<div class="info">
				<img src="img/avatar.png" alt="" class="avatar">
				<div class="text">
					<div class="name">恋痕</div>
					<div class="jif">总积分:200</div>
				</div>
			</div>
			<a href="integral.html" class="icon-wrapper">
				<img src="img/jfen2.png" alt="" class="icon">
				<div class="text">我的积分</div>
			</a>
		</div>
		<img src="img/qiand-icon.png" alt="" class="title-icon">
		<div class="qian-btn">签到</div>
		<div class="notice">每日签到送积分</div>
	</div>

	<div class="qian-time">
		<div class="title">2017年7月</div>
		<div class="time-t">
			<div class="t-item">日</div>
			<div class="t-item">一</div>
			<div class="t-item">二</div>
			<div class="t-item">三</div>
			<div class="t-item">四</div>
			<div class="t-item">五</div>
			<div class="t-item">六</div>
		</div>
		<div class="content">
			<div class="time-item"></div>
			<div class="time-item"></div>
			<div class="time-item"></div>
			<div class="time-item"></div>
			<div class="time-item"></div>
			<div class="time-item"></div>
			<div class="time-item">1</div>
			<div class="time-item">2</div>
			<div class="time-item on">3</div>
			<div class="time-item">4</div>
			<div class="time-item">5</div>
			<div class="time-item">6</div>
			<div class="time-item">7</div>
			<div class="time-item">8</div>
			<div class="time-item">9</div>
			<div class="time-item">10</div>
			<div class="time-item">11</div>
			<div class="time-item">12</div>
			<div class="time-item">13</div>
			<div class="time-item">14</div>
			<div class="time-item">15</div>
			<div class="time-item">16</div>
			<div class="time-item">17</div>
			<div class="time-item">18</div>
			<div class="time-item">19</div>
			<div class="time-item">20</div>
			<div class="time-item">21</div>
			<div class="time-item">22</div>
			<div class="time-item">23</div>
			<div class="time-item">24</div>
			<div class="time-item">25</div>
			<div class="time-item">26</div>
			<div class="time-item">27</div>
			<div class="time-item">28</div>
			<div class="time-item">29</div>
			<div class="time-item">30</div>
			<div class="time-item on">31</div>
		</div>
	</div>

	<div class="mask"></div>
	<div class="qiand-success">
		<img src="img/qiands.png" alt="" class="success-top">
		<div class="notice">签到领取积分80分</div>
		<img src="img/jinb.png" class="icon" alt="">
		<div class="des">签到就送积分！<br>今日领取签到积分</div>
		<div class="num">+80</div>
		<div class="close"></div>
	</div>
	<!-- 以下为页面js部分 -->
	<script type="text/javascript" src="js/rem.js"></script>
	<script type="text/javascript" src="js/jquery.min.js"></script>
	<script type="text/javascript">
		$('.qian-btn').click(function () {
			$('.qian-btn').text('已签到');
			$('.mask').show();
			$('.qiand-success').show();
		})
		$('.close').click(function () {
			$('.mask').hide();
			$('.qiand-success').hide();
		})
		// 遮罩层
	</script>
</body>
</html>